<!DOCTYPE html>
<html lang="cn" xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{baseui/head :: head}">
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta name="description" content="动检通智慧云平台"/>
    <meta name="author" content="牧中(上海)物联网科技有限公司"/>
    <link rel="shortcut icon" href="/webjars/images/favicon.png"/>

    <title>牧中畜牧业大数据智慧云平台V1.0</title>


</head>
<body>
<!--顶部一级导航-->
<th:block th:replace="baseui/topheader :: topheader(1)"/>

<!--动检通菜单-->
<th:block th:replace="djt/partial/topnav :: topnav(4)"/>


<div id="cl-wrapper">
    <!--左边导航-->
    <th:block th:replace="djt/partial/inspector_left :: nav(2)"/>

    <div class="container-fluid" id="pcont">


        <div class="row">
            <div class="col-md-12">
                <div class="block-flat">
                    <div class="header"><h3>督察记录</h3></div>
                    <div class="content">
                        <div class="table-responsive">
                            <div id="datatable_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer">


                                <div class="row" style=" margin-left: 100px">

                                    <!-- search-->

                                    <div style="white-space: nowrap">

                                        <div class="col-sm-2">
                                            <div class="input-group date datetime col-md-5 col-xs-7"
                                                 data-min-view="2" data-date-format="yyyy-mm-dd">
                                                <input id="start" class="form-control" style="width: 90px;" size="16"
                                                       type="text" value="" placeholder="开始时间" readonly>
                                                <span class="input-group-addon btn btn-primary"><span
                                                        class="glyphicon glyphicon-th"></span></span>
                                            </div>
                                        </div>
                                        <div class="col-sm-2">
                                            <div class="input-group date datetime col-md-5 col-xs-7"
                                                 data-min-view="2" data-date-format="yyyy-mm-dd">
                                                <input id="end" class="form-control" style="width: 90px;" size="16"
                                                       type="text" value="" placeholder="结束时间" readonly>
                                                <span class="input-group-addon btn btn-primary"><span
                                                        class="glyphicon glyphicon-th"></span></span>
                                            </div>


                                        </div>

                                        <span style="margin-left: 40px">   区域:
                                                           <select class="select2" style="max-width: 100px;"
                                                                   onchange="showfactory()" id="city">
                                                           <option value="全部">所有区域</option>

                                                                 </select>

                                            </span>


                                        <span style="margin-left: 50px">   畜种:
                                                           <select class="select2" style="max-width: 100px;"
                                                                   id="breedType">
                                                               <option value="-1">全部</option>
                                                               <option value="1">猪 </option>
                                                               <option value="2">牛 </option>
                                                               <option value="3">羊 </option>
                                                               <option value="4">家禽</option>

                                                                 </select>

                                            </span>
                                        <span style="margin-left: 40px">
                                        督察人:
                                                           <select class="select2" style="max-width: 100px;"
                                                                   id="superman">
                                                               <option value="-1">全部</option>


                                                                 </select>
                                        </span>
                                        <span style="margin-left: 40px">
                                        状态:
                                                           <select class="select2" style="max-width: 100px;"
                                                                   id="status">
                                                               <option value="-1">全部</option>


                                                                 </select>
                                        </span>
                                        <span style="margin-left: 40px">
                                        养殖场:
                                                             <select class="select2" style="max-width: 150px;"
                                                                     id="factory">

                                                                       <option value='-1' selected>所有养殖场</option>
                                                                    <span th:each=" breedFactory :${breedFactoryList}">
                                                                  <option th:text="${breedFactory.name}"
                                                                          th:value="${breedFactory.id}">选项 1</option>

                                                                   </span>


                                                       </select>
                                        </span>

                                        <span style="margin-left: 40px">
                                          <button class="btn btn-primary" onclick="SearchBtn()">搜索</button>
                                         </span>

                                    </div>


                                    <div class="row" style=" margin-left: 100px">
                                        <div class="col-sm-12">

                                            <!-- Table -->
                                            <table id="jqGrid"></table>
                                            <div id="jqGridPager"></div>

                                        </div>
                                    </div>


                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>


        </div>
    </div>

</div>

<script type="text/javascript" src="/webjars/js/jquery.js"></script>

<script type="text/javascript" src="/webjars/js/jquery.nanoscroller/jquery.nanoscroller.js"></script>
<script type="text/javascript" src="/webjars/js/behaviour/general.js"></script>
<script src="/webjars/js/jquery.ui/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript" src="/webjars/js/jquery.nestable/jquery.nestable.js"></script>

<script type="text/javascript" src="/webjars/js/bootstrap.switch/bootstrap-switch.min.js"></script>
<script type="text/javascript" src="/webjars/js/bootstrap.datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script src="//cdn.bootcss.com/select2/3.4.5/select2.min.js" type="text/javascript"></script>

<script src="/webjars/js/bootstrap.slider/js/bootstrap-slider.js" type="text/javascript"></script>
<script type="text/javascript" src="/webjars/js/jquery.niftymodals/js/jquery.modalEffects.js"></script>
<script type="text/javascript" src="/webjars/js/bootstrap.summernote/dist/summernote.min.js"></script>


<script type="text/javascript" src="/webjars/js/jquery.magnific-popup/dist/jquery.magnific-popup.min.js"></script>


<script src="/webjars/js/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/ecmascript" src="/webjars/jqgrid/js/i18n/grid.locale-cn.js"></script>
<script type="text/ecmascript" src="/webjars/jqgrid/js/jquery.jqGrid.min.js"></script>
<script src="/webjars/js/laydate/laydate.js"></script>

<script type="text/javascript">
    var PostDatas = {};
    $(document).ready(function () {

        App.init();

        //grid
        $("#jqGrid").jqGrid({
            url: '/djt/breedarch/diagnosisReport/select',
            postData: PostDatas,
            mtype: "post",
            styleUI: 'Bootstrap',
            datatype: "json",
            autowidth: true,
            shrinkToFit: true,
            colModel: [
                {label: '序号', name: 'id', key: true, width: 75, align: 'center'},
                {label: '养殖场名称', name: 'breedFactoryName', width: 200, align: 'center'},
                {label: '病因', name: 'illnessReason', width: 100, align: 'center'},
                {label: '发病数', name: 'cases', width: 100, align: 'center'},
                {label: '用药名称', name: 'drugUsedMethod', width: 100, formatter: ShowMethod, align: 'center'},
                {label: '诊疗结果', name: 'result', width: 100, formatter: Showunit, align: 'center'},
                {label: '日期', name: 'date', width: 200, formatter: ShowDate, align: 'center'},
                {label: '详细', width: 100, align: 'center', formatter: ShowOpertator}
            ],
            viewrecords: true,
            height: 350,

            rowNum: 20,
            pager: "#jqGridPager"
        });

    });

    // 搜索
    var SearchBtn = function () {
        var time1 = $("#start").val();
        var time2 = $("#end").val();
        if (time1 == "") {
            time1 = new Date("2000-01-01 :00:00:00");
        } else {
            time1 = new Date(time1);
        }

        if (time2 == "") {
            time2 = new Date();
        } else {
            time2 = new Date(time2);
        }
        var breedType = $("#breedType").val();
        var illnessReason = $("#illnessReason").val();
        var sdata = {   // 构建查询需要的参数
            illnessReason: illnessReason,
            breedType: breedType,
            time1: time1,
            time2: time2
        };


        var postData = $("#jqGrid").jqGrid("getGridParam", "postData");

        $.extend(postData, sdata);

        $("#jqGrid").jqGrid("setGridParam", {
            search: true    // (6)将jqGrid的search选项设为true
        }).trigger("reloadGrid", [{page: 1}]);   // (7)重新载入Grid表格，以使上述设置生效

    }
    //    时间格式化
    function ShowDate(cellvalue, options, rowObject) {

        var timestamp4 = new Date(cellvalue);
        var dt = timestamp4.toLocaleDateString().replace(/\//g, "-") + " " + timestamp4.toTimeString().substr(0, 8);
        return dt;
    }
    //用药方式
    function ShowMethod(cellvalue, options, rowObject) {
        var type;
        switch (cellvalue) {
            case 1:
                type = "口服";
                break;
            case 2:
                type = "皮下注射";
                break;
            case 3:
                type = "肌肉注射";
                break;
            case 4:
                type = "雾化";
                break;
            case 5:
                type = "滴鼻";
                break;
            case 6:
                type = "其它";
                break;

        }
        return type;
    }

    //查看

    function ShowOpertator(cellvalue, options, rowObject) {
        var link;
        var rowval = rowObject["id"];
        link = "<button type='button' class='btn btn-success'>查看</button>";
        return link;
    }
    //单位
    function Showunit(cellvalue, options, rowObject) {
        var type = cellvalue;
        if (type == null) {
            type = "";
        }
        return type;
    }
</script>


</body>
</html>
